Vue.component('itemqanda',{
    template: `
        <div class="item-wrap " :class="isMore? 'pb-0':''">
            <div class="que-title">
                <span class="icon que">问</span>
                <span class="item-text">{{question}}</span>
            </div>
            <div class="ans-content">
                <div class="text-wrap" ref="answer">
                    <template v-if="answer">
                        <div class="icon ans">答</div>
                        <div class="item-content" 
                               ref="itemText"
                               :style="{maxHeight:isOpen? '1.26rem':''}" v-html="answer"></div>  
                    </template>
                    <template v-else>
                        <div class="wait-ans">等待回答~</div>
                    </template>
                </div>
                <div class="more-text" 
                     v-if="isMore" 
                     @click="isOpen=!isOpen"
                     >{{isOpen?'展开':'收起'}} 
                     <img class="arrow-icon" 
                           :class="isOpen?'down':'up'" 
                           :src="hxmConfig.arrowRightImgUrl"
                      />
                 </div>
            </div>
        </div>`,

    data(){
        return{
            isMore:false,
            isOpen:true,
        }
    },
    props:{
      question:{
          type:String,
          default:null
      },
      answer:{
          type:String,
          default:null
      },
      status:{
          type:String,
          default:'1'
      }
    },
    created() {
        this.hasMore()
    },
    methods:{
        //判断文本是否多出
        hasMore(){
            setTimeout(()=>{
                if(!this.$refs.itemText){  return }
                let height = this.$refs.itemText.scrollHeight
                let ele= document.getElementsByClassName('item-text')[0]
                let lineHeight = window.getComputedStyle(ele).lineHeight.replace('px','')
                if (height / +lineHeight > 3) {
                    this.isMore = true
                } else {
                    this.isMore = false
                }
            },100)
        }
    },
})